﻿@extends('layouts.shop_main')

@section('title', '账户信息')

@section('resources')
    @parent
    <style>
        .header{margin: 0 30px 20px 30px;padding: 10px 0;overflow: hidden;border-bottom: 1px solid #eee;}
        .header p{float: left;font-size: 18px;overflow: hidden;}
        .header p span{float: left;font-size: 18px;margin-right: 10px;}
        .order_content{margin: 0 30px;}
        .order_content .name_money p{font-size: 18px;margin: 20px 0;}
        .order_content .title{position: relative;height: 35px;margin-top: 20px;}
        .order_content .title span{font-size: 18px;border-left: 3px solid #999;padding: 0 20px;position: absolute;top: 0;left: 0;background-color: #fff;}
        .order_content .title p{border-bottom: 1px solid #eee;float: left;position: absolute;top: 13px;left: 0;width: 100%;}
        /*.order_content .none_passwold{overflow: hidden;}*/
        .order_content .none_passwold p{font-size: 16px;color: #808080;overflow: hidden;}
        .order_content .none_passwold input{float: left;border: 1px solid #999;border-radius: 5px;width: 100px;height: 28px;background-color: #fff;margin-top: 10px;color: #808080;}
        .order_content .none_passwold span{float: left;margin-top: 10px;line-height: 30px;margin-right: 30px;}
        .order_content .by_shop{font-size: 14px;}
        .order_content .by_shop li{padding: 10px 0;border-bottom: 1px solid #eee;}
        .order_content .by_shop li p{overflow: hidden;margin: 10px 0;}
        .order_content .by_shop li p span{width: 300px;float: left;}
        .set_passwold{display: none;}
        .set_passwold p{margin: 10px 0;}
        .set_passwold p input[type="password"]{width: 300px;height: 30px;padding: 5px;border: 1px solid #eee;}
        .set_passwold p input[type="button"]{width: 100px;height: 30px;border-radius: 5px;margin-right: 20px;}
        .message_set_passwold{display: none;}
        .message_set_passwold p{margin: 10px 0;overflow: hidden;}
        .message_set_passwold p input[type="text"]{width: 150px;height: 30px;padding: 5px;border: 1px solid #eee;float: left;}
        .message_set_passwold p input[type="password"]{width: 300px;height: 30px;padding: 5px;border: 1px solid #eee;}
        .message_set_passwold p input[type="button"]{width: 100px;height: 30px;border-radius: 5px;margin-right: 20px;}
        .message_set_passwold p .get_code{width: 130px;height: 30px;border-radius: 5px;margin-left: 20px;line-height: 30px;text-align: center;border: 1px solid #9955c6;float: left;color: #9955c6;cursor: pointer;}
    </style>
@endsection

@section('content')
	<div class="content">
        <div class="header">
            <p>账户信息</p>
        </div>
        <section class="order_content">
            <div class="name_money">
                <p>姓名：{{$name}}</p>
                <p>账号：{{$mobile}}</p>
            </div>
            <div class="title">
                <p></p>
               <span>登录密码</span> 
            </div>
            <div class="none_passwold">
                <p>
                    登录密码长度6-16位，建议您定期更换密码，确保账号安全。
                </p>
                <p>
                    <span>记得原密码</span>
                    <input class="revise_password" type="button" name="" value="修改密码">
                </p>
                <p>
                    <span>忘记原密码</span>
                    <input class="get_back_password" type="button" name="" value="找回密码">
                </p>
            </div>
            <form class="set_passwold" action="" method="">
                <input type="hidden" name="password_update_type" value="oldpassword">
                <p>
                   <input type="password" name="oldpassword" value="" placeholder="原密码">
                </p>
                <p>
                   <input type="password" name="password" value="" placeholder="新密码">
                </p>
                <p>
                  <input type="password" name="confirmpassword" value="" placeholder="再确认一次">
                </p>
                <p>
                    <input class="sure" style="background-color: #9955c6;color: #fff;" type="button" name="" value="确认">
                    <input class="cancel" type="button" name="" value="取消">
                </p>
            </form>
            <form class="message_set_passwold" action="" method="">
                <input type="hidden" name="password_update_type" value="sms">
                <p>
                   <input type="text" name="code" value="" placeholder="短信验证码">
                   <span class="get_code">获取验证码</span>
                </p>
                <p>
                   <input type="password" name="password" value="" placeholder="新密码">
                </p>
                <p>
                  <input type="password" name="confirmpassword" value="" placeholder="再确认一次">
                </p>
                <p>
                    <input class="sure" style="background-color: #9955c6;color: #fff;" type="button" name="" value="确认">
                    <input class="cancel" type="button" name="" value="取消">
                </p>
            </form>
            <div class="title">
                <p></p>
               <span>所属门店</span> 
            </div>
            <ul class="by_shop">
            @foreach($lists as $list)
                <li>
                    <p>
                        <span>{{$list['shopname']}}</span>
                    @if($list['isadmin'])
                        <span>管理员</span>
                    @endif
                    </p>
                    <p>{{$list['address']}}</p>
                </li>
            @endforeach
            </ul>
        </section>
    </div>
@endsection

@section('scriptResources')
    @parent
    <script>
        var mobile='{{$mobile}}';
        $(".none_passwold .revise_password").click(function(){
            $(".none_passwold").hide();
            $(".set_passwold").show();
        })
        $(".none_passwold .get_back_password").click(function(){
            $(".none_passwold").hide();
            $(".message_set_passwold").show();
        })
        $(".set_passwold .cancel").click(function(){
            $(".none_passwold").show();
            $(".set_passwold").hide();
        })
        //原密码找回密码
        $(".set_passwold .sure").click(function(){
            $.ajax({
                url :"/shop/user/password/update",
                type:'POST',
                data : $(".set_passwold").serialize(),
                dataType:'json',
                async:false,
                success:function(data){
                    if (data.status == "success") {
                        alert(data.message);
                        $(".none_passwold").show();
                        $(".set_passwold").hide();
                        window.location.href='/shop/login';
                    } else {
                        alert(data.message);
                    }
                }
            });
        })
        $(".message_set_passwold .cancel").click(function(){
            $(".none_passwold").show();
            $(".message_set_passwold").hide();
        })
        //验证码找回密码
        $(".message_set_passwold .sure").click(function(){
            $.ajax({
                url :"/shop/user/password/update",
                type:'POST',
                data : $(".message_set_passwold").serialize(),
                dataType:'json',
                async:false,
                success:function(data){
                    if (data.status == "success") {
                        alert(data.message);
                        $(".none_passwold").show();
                        $(".message_set_passwold").hide();
                        window.location.href='/shop/login';
                    } else {
                        alert(data.message);
                    }
                }
            });
        })
        //获取验证码TODO
        var countdown = 60;
        var get_code_timer=1;
        $('.get_code').click(function(){
            if(get_code_timer == 1){
                 $.ajax({
                     url: '/shop/login/code/get',
                     type: 'get',
                     data: {'mobile':mobile},
                     dataType:'json',
                     async:false,
                     success:function(data){
                         if(data.status == 'success') {
                             var timer = setInterval(function(){
                                 if(countdown == 0){
                                     $(".get_code").html("重新获取验证码");
                                     get_code_timer=1;
                                     countdown = 60;
                                     clearInterval(timer)
                                 }else{
                                     countdown--;
                                     $(".get_code").html(countdown+'秒');
                                     get_code_timer=0;
                                 }
                             },1000)
                         } else {
                            alert(data.message);return;
                         }
                     }
                 })
            }
        })
        // $(".get_code").click(function(){
        //      $.ajax({
        //          url :"/shop/login/code/get",
        //          type:'get',
        //          data : {'mobile':mobile},
        //          dataType:'json',
        //          async:false,
        //          success:function(data){
        //              if (data.status == "success") {
        //                 var timer = setInterval(function(){
        //                      if(countdown == 0){
        //                          $(".get_code").val("重新获取验证码");
        //                          get_code_timer=1;
        //                          countdown = 60;
        //                          clearInterval(timer)
        //                      }else{
        //                          countdown--;
        //                          $(".get_yzm").val(countdown+'秒');
        //                          get_code_timer=0;
        //                      }
        //                  },1000)
        //              } else {
        //                  alert(data.message);return;
        //              }
        //          }
        //      });
        // })
    </script>
@endsection